<template>
	<view class="detailC">
		<view class="title">{{title}}</view>
		<view class="content">{{content}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id : "" ,
				title : "暂无数据",
				content : "暂无数据"
			};
		},
		onLoad(option){
			console.log("消息详情option");
			console.log(option);
			this.id = option.id;
			this.getMessageDetail();
		},
		methods:{
			getMessageDetail(){
				let params = {
					id : this.id
				};
				
				this.http.get("/messages/getDetail" , params)
				.then((res)=>{
					console.log("获取消息详情--成功");
					console.log(res);
					if(res.code != 1){
						return
					}
					
					this.title = res.data.title;
					this.content = res.data.content;
					this.readInformation();
				})
				.catch((err)=>{
					console.log("获取消息详情--失败");
					console.log(err);
				})	
			},
			readInformation(){
				let body = {
					id : this.id
				};
				
				this.http.post("/messages/saveReadStatus" , body)
				.then((res)=>{
					console.log("消息状态修改成功");
					console.log(res);
				})
				.catch((err)=>{
					console.log("消息状态修改失败");
					console.log(err);
				})
				
			}
		},//methods
		
	}
</script>

<style lang="scss">
.detailC{
	background-color: #f5f5f5;
}

.title{
	
	box-sizing: border-box;
	max-height: 250rpx;
	border-radius: 20rpx;
	overflow-y: scroll;
	margin-top: 40rpx;
	margin-left: 20rpx;
	margin-right: 20rpx;
	padding:25rpx;
	font-weight: 800;
	background-color: #fff;
}

.content{
	min-height: 300rpx;
	margin-top: 50rpx;
	box-sizing: border-box;
	overflow-y: scroll;
	margin-left: 20rpx;
	margin-right: 20rpx;
	padding:25rpx;
	border-radius: 20rpx;
	background-color: #fff;
}

</style>
